{
	template:`
    <m-page @back="back" title="订单信息">
        <template #bar>
            <div class="padding-left">
                <status type="orderStatus" :value="model.status"></status>
            </div>
            <div class="flex-sub padding-lr text-sm text-right">
                [{{dict('member.order.model.OrderInfo!payType',model.payType)}}]<br />
                <span class="text-red text-df padding-left-sm">{{formatAmount(model.payAmount)}}</span>元
            </div>
            <div class="m-buttons padding-right">
                <m-button v-if="model.oid&&model.status=='A'&&editable" @click="next('delete','确定要删除吗？')" type="error">删除</m-button>
                <m-button v-if="editable" @click="save(false)">保存</m-button>
                <m-button v-if="editable" @click="save(true)" type="success">提交</m-button>
                <m-button v-if="model.oid&&confirmable" @click="next('back','确定要退回吗？')" type="warn">退回</m-button>
                <m-button v-if="model.oid&&confirmable" @click="next('confirm','确定要审核通过吗？')" type="success">确认</m-button>
            </div>
        </template>
        <m-top></m-top>
        <m-title>订单信息<template #action>订单编号：{{model.orderNo}}</template></m-title>
        <m-card>
            <div class="cu-form-group">
                <div v-if="model.member.oid" class="cu-tag radius" :class="'bg-'+model.member.level.color">{{model.member.level.name}}</div>
                <div v-else class="title text-red">会员</div>
                <m-form-item>
                    <div v-if="model.member.oid" class="padding-left-sm">
                        <span class="text-sm" :class="'text-'+model.member.level.color">优惠{{model.member.level.discount}}%</span>
                        {{model.member.realName}}
                        <span class="text-sm">{{model.member.phoneNum}}</span>
                        <div>
                            <small>余额</small><span class="text-red">{{formatNumber(model.member.balance-model.member.freeze,'#,##0.00')}}</span><small>元</small>
                        </div>
                    </div>
                    <div v-else-if="editable" class="text-placeholder">请选择会员</div>
                    <template #action>
                        <m-button v-if="editable" @click="selectMember(model)" size="sm">选择</m-button>
                    </template>
                </m-form-item>
            </div>
            <div class="cu-form-group">
                <div class="title text-red">服务员工</div>
                <m-form-item>
                    <div v-if="model.serveUser.oid">{{model.serveUser.realName}} <span class="text-sm">{{model.serveUser.phoneNum}}</span></div>
                    <div v-else-if="editable" class="text-placeholder">请选择员工</div>
                    <template #action>
                        <m-button v-if="editable" @click="selectServeUser(model)" size="sm">选择</m-button>
                    </template>
                </m-form-item>
            </div>
            <div class="cu-form-group">
                <div class="title">订单金额</div>
                <div class="flex-sub">{{formatAmount(model.orderAmount)}}元</div>
                <div>会员优惠{{formatAmount(model.preferentialAmount)}}元</div>
            </div>
            <div class="cu-form-group">
                <div class="title text-red">其他金额</div>
                <m-input-number :operable="editable" v-model="model.otherAmount" @change="setOrderAmount(model.orderAmount)" placeholder="请输入其他金额"></m-input-number>
                <div>元</div>
            </div>
            <div class="cu-form-group">
                <div v-if="model.memberDayAmount" class="text-sm text-right">
                    <div>会员日再优惠{{dayRate}}%</div>
                    <div>{{formatAmount(model.memberDayAmount)}}元</div>
                </div>
                <div class="flex-sub text-right">
                    实付金额：
                    <span class="text-red text-lg">{{formatAmount(model.payAmount)}}</span>
                    元
                </div>
            </div>
            <div class="cu-form-group">
                <div class="title text-red">付款类型</div>
                <m-dict-option :operable="editable" class="flex-sub" v-model="model.payType" multiple @change="setPayType" type="member.order.model.OrderInfo!payType"></m-dict-option>
            </div>
            <div v-if="pays.length>1" class="cu-form-group">
                <m-grid :col="2" class="flex-sub">
                    <m-desc v-for="pay in pays" :innerClass="'padding-lr-sm padding-tb-xs radius light bg-'+(pay.payAmount>0?'blue':'red')">
                        <div class="flex" style="line-height:20px;">
                            <div class="padding-right-xs">{{dict('member.order.model.OrderInfo!payType',pay.payType)}}</div>
                            <m-input-number :operable="editable" v-model="pay.payAmount" placeholder="请输入金额"></m-input-number>
                            <div>元</div>
                        </div>
                    </m-desc>
                </m-grid>
            </div>
            <div class="cu-form-group">
                <div class="title text-red">账期</div>
                <m-select-date :operable="editable||confirmable" class="flex-sub" v-model="model.accountDate" placeholder="请选择账期"></m-select-date>
            </div>
            <div class="cu-form-group">
                <div class="title">备注</div>
                <m-input type="textarea" :operable="editable||confirmable" v-model="model.remark" placeholder="请输入备注"></m-input>
            </div>
        </m-card>
        <m-title>订单明细
            <template #action>
                <m-button v-if="editable" @click="openDetail(-1,{serve:{type:{}},num:1})">添加</m-button>
            </template>
        </m-title>
        <m-top></m-top>
        <m-alert v-if="list.length==0" join color="orange">请添加订单明细！</m-alert>
        <m-card join v-for="(item,key) in list">
            <div class="flex padding-sm align-center">
                <div class="cu-tag radius" :class="'bg-'+item.serve.type.color">{{item.serve.type.name}}</div>
                <div class="flex-sub padding-lr-sm">
                    {{item.serve.title}}
                    <div class="text-sm text-gray">
                        原价{{formatAmount(item.price)}}元
                        <span v-if="item.discount" class="padding-bottom-xs text-blue">优惠{{item.discount}}%</span>
                    </div>
                </div>
                <div class="text-sm text-right">
                    ×{{formatAmount(item.num)}}
                    <div>
                        <span class="text-red text-lg">{{formatAmount(item.total)}}</span>元
                    </div>
                </div>
            </div>
            <div class="flex text-sm">
                <div class="flex-sub padding-lr-sm padding-bottom-sm">{{item.serve.description}}</div>
                <div v-if="editable" class="m-buttons padding-bottom-sm padding-right-sm">
                    <m-button size="sm" @click="openDetail(key,item)">修改</m-button>
                    <m-button size="sm" @click="deleteDetail(key)" type="error" line>删除</m-button>
                </div>
            </div>
        </m-card>
        <m-title>登记确认信息</m-title>
        <m-card>
            <div class="padding-xs flex align-center">
                <m-grid :col="2" class="flex-sub">
                    <m-desc title="登记员工">{{model.inputUser.realName}}<small>{{model.inputUser.phoneNum}}</small></m-desc>
                    <m-desc title="登记时间">{{formatDate(model.inputDate,'yyyy-MM-dd HH:mm')}}</m-desc>
                    <m-desc title="确认员工">{{model.confirmUser.realName}}<small>{{model.confirmUser.phoneNum}}</small></m-desc>
                    <m-desc title="确认时间">{{formatDate(model.confirmDate,'yyyy-MM-dd HH:mm')}}</m-desc>
                </m-grid>
                <qrcode v-if="model.oid" :path="'/web/member/main.js?oid='+model.member.oid+'&page=orderInfo&param.oid='+model.oid"></qrcode>
            </div>
        </m-card>
		<m-modal ref="detail" title="订单明细">
			<div v-if="showDetail">
				<m-card>
                    <div class="cu-form-group">
                        <div v-if="showDetail.serve.oid" class="cu-tag radius" :class="'bg-'+showDetail.serve.type.color">{{showDetail.serve.type.name}}</div>
                        <div v-else class="title text-red">服务商品</div>
                        <m-form-item>
                            <div v-if="showDetail.serve.oid" class="flex-sub padding-left-sm">
                                {{showDetail.serve.title}}
                                <div class="text-sm text-gray">
                                    原价{{formatAmount(showDetail.price)}}元
                                    <span v-if="showDetail.discount" class="padding-bottom-xs text-blue">优惠{{showDetail.discount}}%</span>
                                </div>
                            </div>
                            <div v-else class="flex-sub text-placeholder">请选择服务商品</div>
                            <template #action>
                                <div class="text-right">
                                    <div v-if="showDetail.serve.oid"><span class="text-red">{{formatAmount(showDetail.price-showDetail.price*(showDetail.discount||0)/100)}}</span>元</div>
                                    <m-button @click="selectServeGoods(showDetail)" size="sm">选择</m-button>
                                </div>
                            </template>
                        </m-form-item>
                    </div>
                    <div v-if="showDetail.serve.description" class="cu-form-group text-sm">
                        {{showDetail.serve.description}}
                    </div>
                    <div class="cu-form-group">
                        <div class="title text-red">数量</div>
                        <m-input-number v-model="showDetail.num" placeholder="请输入数量" @change="countShowTotal"></m-input-number>
                    </div>
                    <div class="cu-form-group">
                        <div class="title">金额</div>
                        <div class="flex-sub">{{showDetail.total}}</div>
                        <div>元</div>
                    </div>
				</m-card>
                <div class="flex padding-lr-sm padding-bottom">
                    <div class="flex-sub flex flex-direction padding-lr-xs">
                        <m-button @click="closeDetail()" line>关闭</m-button>
                    </div>
                    <div class="flex-sub flex flex-direction padding-lr-xs">
                        <m-button @click="closeDetail(showDetail)">确定</m-button>
                    </div>
                </div>
			</div>
		</m-modal>
    </m-page>
	`,
	props: ['param','parentVue'],
	data:function(){
		return {
		    model:{member:{realName:'*'},serveUser:{},inputUser:{},inputStore:{},confirmUser:{}},
		    list:[],
		    pays:[],
		    editable:false,
		    confirmable:false,
		    showIndex:-1,
            showDetail:null,
            dayRate:0,
		};
	},
	mounted(){
	    this.model.oid=this.param.oid;
	    this.loadModel();
	},
	methods:{
	    loadModel:function(fn){
            this.requestData('action/order/orderInfo/getInfo',
                {oid:this.model.oid},
                (data)=>{
                    if(data.code==0){
                        this.model=data.model;
                        this.list=data.list;
                        this.pays=data.pays;
                        this.dayRate=data.dayRate;
                        this.editable=data.editable;
                        this.confirmable=data.confirmable;
                        if(fn) fn();
                    }else{
                        this.remind().error(data.msg);
                    }
                }
            );
	    },
        openDetail:function(index,item){
            this.showIndex=index;
            this.showDetail=Object.assign({},item);
            this.$refs.detail.open();
        },
        closeDetail:function(item){
            if(item){
                if(this.showIndex>=0){
                    this.list[this.showIndex]=item;
                }else{
                    this.list.push(item);
                }
                let allAmount=0.0;
                for(var i=0;i<this.list.length;i++){
                    allAmount+=this.list[i].total;
                }
                this.setOrderAmount(allAmount);
            }
            this.$refs.detail.close();
        },
        deleteDetail:function(index){
            this.confirm('删除确认','确定要删除这条明细吗？',()=>{
                this.list.splice(index,1);
                let allAmount=0.0;
                for(var i=0;i<this.list.length;i++){
                    allAmount+=this.list[i].total;
                }
                this.setOrderAmount(allAmount);
            });
        },
        setOrderAmount:function(amount){
            this.model.orderAmount=amount;
            if(this.model.member.oid){
                this.model.preferentialAmount=this.roundNumber(amount*this.model.member.level.discount/100,2);
                this.model.memberDayAmount=-this.roundNumber((amount-this.model.preferentialAmount+this.model.otherAmount)*this.dayRate/100,2);
                this.model.payAmount=this.roundNumber(amount-this.model.preferentialAmount+this.model.otherAmount+this.model.memberDayAmount,2);
            }
            this.setPayType();
        },
        setPayType:function(){
            if(this.model.payType.length==1){
                this.pays=[{payType:this.model.payType[0],payAmount:this.model.payAmount}];
                return;
            }
            let all=this.model.payAmount;
            let balance=this.roundNumber(this.model.member.balance-this.model.member.freeze,2)||0;
            let ps=[];
            for(let i=0;i<this.model.payType.length;i++){
                let pt=this.model.payType[i];
                let pa=0;
                if(pt=='0'){
                    pa=balance>all?all:balance;
                }else{
                    pa=all>0?all:0;
                }
                all-=pa;
                ps.push({payType:pt,payAmount:pa});
            }
            this.pays=ps;
        },
        selectMember:function(model){
            let selectOid=model.member?model.member.oid:'';
	        this.openPage('common/selectMember.js',{title:'选择会员',selectOid:selectOid},(flag,obj)=>{
	            if(flag){
	                model.member=obj;
	                this.setOrderAmount(this.model.orderAmount);
                }
	        });
        },
        selectServeUser:function(model){
            let selectOid=model.serveUser?model.serveUser.oid:'';
	        this.openPage('common/selectUser.js',{title:'选择店长',selectOid:selectOid,storeOid:config.store.oid},(flag,obj)=>{
	            if(flag){
	                model.serveUser=obj;
                }
	        });
        },
        selectServeGoods:function(model){
            let selectOid=model.serve?model.serve.oid:'';
	        this.openPage('common/selectServeGoods.js',{title:'选择服务商品',selectOid:selectOid},(flag,obj)=>{
	            if(flag){
	                model.serve=obj;
	                model.price=obj.price;
	                model.discount=obj.discount;
	                this.countShowTotal();
                }
	        });
        },
        countShowTotal:function(){
            this.showDetail.total=this.roundNumber(this.showDetail.price*(this.showDetail.num||0)*(1-(this.showDetail.discount||0)/100.0),2);
        },
        save:function(isSubmit){
            let fn=()=>{
                this.requestData('action/order/orderInfo/'+(isSubmit?'submit':'save'),
                    {model:this.model,list:this.list,pays:this.pays},
                    (data)=>{
                        if(data.code==0){
                            this.remind().success(data.msg);
                            this.model.oid=data.oid;
                            if(isSubmit){
                                this.back(true,this.model);
                            }else{
                                this.loadModel(()=>{
                                    this.setBack(true,this.model);
                                });
                            }
                        }else{
                            this.remind().error(data.msg);
                        }
                    }
                );
            }
            if(isSubmit){
                this.confirm("保存并提交","确定要保存并提交吗？",fn);
            }else{
                fn();
            }
        },
        next:function(oper,confirmAlert){
            this.confirm('操作提示',confirmAlert||'确定要这样操作吗？',()=>{
                this.requestData('action/order/orderInfo/'+oper,
                    {model:this.model},
                    (data)=>{
                        if(data.code==0){
                            this.remind().success(data.msg);
                            this.back(true,this.model);
                        }else{
                            this.remind().error(data.msg);
                        }
                    }
                );
            });
        }
	}
}